<template>
  <ph-view>
    <ph-tab>
      <ph-tab-panel title="面板">
        <ph-panel title="你好中国" :collapsable="true" type="primary"
          >primary</ph-panel
        >
        <ph-panel title="你好中国" type="info">info</ph-panel>
        <ph-panel title="你好中国" type="success"
          >阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒的看法</ph-panel
        >
        <ph-panel title="你好中国" type="warning">warning</ph-panel>
        <ph-panel title="你好中国" type="danger">danger</ph-panel>
        <ph-panel title="你好">danger</ph-panel>
        <ph-pretty>{{ demo1 }}</ph-pretty>
      </ph-tab-panel>
      <ph-tab-panel title="面板组">
        <ph-panel-group>
          <ph-panel :collapsable="true" :collapse="true" title="你好中国"
            >danger</ph-panel
          >
          <ph-panel :collapsable="true" :collapse="true" title="你好中国"
            >info</ph-panel
          >
          <ph-panel
            :collapsable="true"
            :collapse="true"
            title="你好中国"
            contentHeight="150px"
          >
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒
            阿死了都快减肥撒懒得看阿死掉了飞机撒到了<a>副科级阿死了</a>大家发送大量开发阿死里打飞机撒代理反馈阿死掉了飞机撒的看法
          </ph-panel>
          <ph-panel :collapsable="true" :collapse="true" title="你好中国"
            >warning</ph-panel
          >
          <ph-panel :collapsable="true" :collapse="true" title="你好中国"
            >danger</ph-panel
          >
          <ph-panel :collapsable="true" :collapse="true" title="你好"
            >danger</ph-panel
          >
        </ph-panel-group>
        <ph-pretty>{{ demo2 }}</ph-pretty>
      </ph-tab-panel>
      <ph-tab-panel title="基本介绍">
        <ph-pretty>{{ baseUsage }}</ph-pretty>
      </ph-tab-panel>
    </ph-tab>
  </ph-view>
</template>
<script lang="ts">
import { defineComponent } from "vue";
import { PhPanel, PhPanelGroup, PhTabPanel, PhTab, PhView } from "@/index";
import * as Data from "../data/panel";
export default defineComponent({
  components: { PhPanel, PhPanelGroup, PhTabPanel, PhTab, PhView },
  setup() {
    return { ...Data };
  },
});
</script>
